﻿<%@ Page Title="" Language="C#" MasterPageFile="~/UserCP.Master" AutoEventWireup="true"
    CodeBehind="UserProfileCP.aspx.cs" Inherits="University.Workshop.WebApp.UserProfileCP" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
    <link rel="stylesheet" type="text/css" href="Styles/UserProfileCPStyle.css"/>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <div style='background-color: #4b6c9e; color: White; height: 20px; margin-bottom: 10px;
        width: 700px; text-align: center;'>
        Privacy Settings
    </div>
    <div style='margin-bottom: 10px;'>
        Set which information is visible for other people
    </div>
    <div style='margin-bottom: 10px; height: 246px'>
        <table align="left">
            <tr>
                <td class="style1">
                    First Name:
                </td>
                <td>
                    <asp:TextBox ID="TbFirstName" runat="server" ReadOnly="true"></asp:TextBox>
                </td>
                <td>
                    <asp:DropDownList ID="status1" runat="server">
                        <asp:ListItem Text="Visible" Value="Visible"></asp:ListItem>
                        <asp:ListItem Text="Not Visible" Value="Not Visible"></asp:ListItem>
                    </asp:DropDownList>
                </td>
            </tr>
            <tr>
                <td class="style1">
                    Last Name:
                </td>
                <td>
                    <asp:TextBox ID="TbLastName" runat="server" ReadOnly="true"></asp:TextBox>
                </td>
                <td>
                    <asp:DropDownList ID="status2" runat="server">
                        <asp:ListItem Text="Visible" Value="Visible"></asp:ListItem>
                        <asp:ListItem Text="Not Visible" Value="Not Visible"></asp:ListItem>
                    </asp:DropDownList>
                </td>
            </tr>
            <tr>
                <td class="style1">
                    Gender:
                </td>
                <td>
                    <asp:TextBox ID="TbGender" runat="server" ReadOnly="true"></asp:TextBox>
                </td>
                <td>
                    <asp:DropDownList ID="status3" runat="server">
                        <asp:ListItem Text="Visible" Value="Visible"></asp:ListItem>
                        <asp:ListItem Text="Not Visible" Value="Not Visible"></asp:ListItem>
                    </asp:DropDownList>
                </td>
            </tr>
            <tr>
                <td class="style1">
                    Birthday:
                </td>
                <td>
                    <asp:TextBox ID="TbBirthday" runat="server" ReadOnly="true"></asp:TextBox>
                </td>
                <td>
                    <asp:DropDownList ID="status4" runat="server">
                        <asp:ListItem Text="Visible" Value="Visible"></asp:ListItem>
                        <asp:ListItem Text="Not Visible" Value="Not Visible"></asp:ListItem>
                    </asp:DropDownList>
                </td>
            </tr>
            <tr>
                <td class="style1">
                    Phone:
                </td>
                <td>
                    <asp:TextBox ID="TbPhone" runat="server" ReadOnly="true"></asp:TextBox>
                </td>
                <td>
                    <asp:DropDownList ID="status5" runat="server">
                        <asp:ListItem Text="Visible" Value="Visible"></asp:ListItem>
                        <asp:ListItem Text="Not Visible" Value="Not Visible"></asp:ListItem>
                    </asp:DropDownList>
                </td>
            </tr>
            <tr>
                <td class="style1">
                    Mobile Phone:
                </td>
                <td>
                    <asp:TextBox ID="TbMobile" runat="server" ReadOnly="true"></asp:TextBox>
                </td>
                <td>
                    <asp:DropDownList ID="status6" runat="server">
                        <asp:ListItem Text="Visible" Value="Visible"></asp:ListItem>
                        <asp:ListItem Text="Not Visible" Value="Not Visible"></asp:ListItem>
                    </asp:DropDownList>
                </td>
            </tr>
            <tr>
                <td class="style1">
                    Department:
                </td>
                <td>
                    <asp:TextBox ID="TbDepartment" runat="server" ReadOnly="true"></asp:TextBox>
                </td>
                <td>
                    <asp:DropDownList ID="status7" runat="server">
                        <asp:ListItem Text="Visible" Value="Visible"></asp:ListItem>
                        <asp:ListItem Text="Not Visible" Value="Not Visible"></asp:ListItem>
                    </asp:DropDownList>
                </td>
            </tr>
            <tr>
                <td class="style1">
                    City:
                </td>
                <td>
                    <asp:TextBox ID="TbCity" runat="server" ReadOnly="true"></asp:TextBox>
                </td>
                <td>
                    <asp:DropDownList ID="status8" runat="server">
                        <asp:ListItem Text="Visible" Value="Visible"></asp:ListItem>
                        <asp:ListItem Text="Not Visible" Value="Not Visible"></asp:ListItem>
                    </asp:DropDownList>
                </td>
            </tr>
        </table>
    </div>
    <div>
        <table>
            <tr>
                <td>
                <asp:DropDownList runat="server" ID="showItems" AutoPostBack="True" OnSelectedIndexChanged="showItems_SelectedIndexChanged">
                    <asp:ListItem Text="Don't show any product" Value="0" />
                    <asp:ListItem Text="Show the following products" Value="1" />
                </asp:DropDownList>
                </td>
                <td>
                    <asp:Button runat="server" ID="btnSelectProducts" Text="Select products" 
                        ToolTip="Create or modify the list of products you want to show" 
                        onclick="btnSelectProducts_Click"/>
                </td>
            </tr>
        </table>
    </div>
    <div style="margin-top: 4px; margin-bottom: 7px;">
        <asp:Label runat="server" ID="lblProducts" Text="Products shown on your profile" ToolTip="This is the list of products shown on your profile, so people can see some products you are selling when they visit your profile"></asp:Label>
    </div>
    <asp:ToolkitScriptManager ID="ToolkitScriptMngr" runat="server"/>
    <asp:UpdatePanel runat="server">
    <ContentTemplate>
    <div style='margin-bottom: 10px; height: auto'>
        <asp:DataList ToolTip="This is the list of products shown on your profile, so people can see some products you are selling when they visit your profile"
         runat="server" ID="dataList" CellPadding="2" CellSpacing="2" BorderStyle="Double"
            BackColor="#e8e8e8" Width="100%" headerstyle-font-name=" Helvetica" HeaderStyle-Font-Size="10pt"
            HeaderStyle-HorizontalAlign="center" HeaderStyle-Font-Bold="True" HeaderStyle-ForeColor="#000000"
            ItemStyle-BackColor="#4b6c9e" ItemStyle-ForeColor="#ffffff" AlternatingItemStyle-BackColor="#ffffff"
            AlternatingItemStyle-ForeColor="#000000">
            <HeaderTemplate>
                Products
            </HeaderTemplate>
            <ItemTemplate>
                <h4>
                    <asp:Label ID="ProductNameLabel" runat="server" ForeColor="White" Text='<%# Eval("Name") %>' /></h4>
                <table border="0">
                    <tr>
                        <td>
                            Category:
                        </td>
                        <td>
                            <asp:Label ID="lblCategory" runat="server" Text='<%# Eval("Category") %>' />
                        </td>
                        <td>
                            Price:
                        </td>
                        <td>
                            <asp:Label ID="lblPrice" runat="server" />
                            <%# Eval("Price", "{0:0.00}")%>
                            <%# Eval("Currency") %>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Posted Date:
                        </td>
                        <td>
                            <asp:Label ID="lblDate" runat="server" Text='<%# Eval("Postdate") %>' />
                        </td>
                    </tr>
                </table>
            </ItemTemplate>
            <AlternatingItemTemplate>
                <h4>
                    <asp:Label ID="ProductNameLabel" runat="server" ForeColor="Black" Text='<%# Eval("Name") %>' /></h4>
                <table border="0">
                    <tr>
                        <td>
                            Category:
                        </td>
                        <td>
                            <asp:Label ID="lblCategory" runat="server" Text='<%# Eval("Category") %>' />
                        </td>
                        <td class="ProductPropertyLabel">
                            Price:
                        </td>
                        <td>
                            <asp:Label ID="lblPrice" runat="server" />
                            <%# Eval("Price", "{0:0.00}")%>
                            <%# Eval("Currency") %>
                        </td>
                    </tr>
                    <tr>
                        <td >
                            Posted Date:
                        </td>
                        <td>
                            <asp:Label ID="lblDate" runat="server" Text='<%# Eval("Postdate") %>' />
                        </td>
                    </tr>
                </table>
            </AlternatingItemTemplate>
        </asp:DataList>
    </div>
    </ContentTemplate>
    </asp:UpdatePanel>
    <asp:Label runat="server" ID="LblInfo1" Text="You are not showing any products!" Font-Italic="true"> </asp:Label>
    <asp:Label runat="server" ID="LblInfo2" Text="You have not selected any products to show!" Font-Italic="true"></asp:Label>
    <div style='margin-bottom: 30px; margin-top: 10px; height: 30px;'>
        <asp:Button runat="server" ID="btnSubmit" Text="Save Changes" OnClick="btnSubmit_Click" />
    </div>
    <div runat="server" id="divPopUp" style="visibility: hidden">
        <asp:Panel ID="pnlModal" runat="server" CssClass="modal">
        <asp:UpdatePanel runat="server" ID="UpdatePnl">
            <ContentTemplate>
            <div class="rel">
                <div class="modal-inner-wrapper rounded-corners">
                    <div class="content rounded-corners">
                       <div class="close">
                           <asp:LinkButton ID="btnClose" runat="server" onclick="btnClose_Click">Close</asp:LinkButton>
                       </div>
                       <div class="body">
                           <table align="center">
                               <tr>
                                   <td>
                                       <asp:Label runat="server" Text="Your products"></asp:Label>
                                   </td>
                               </tr>
                               <tr>
                                   <td >
                                       <asp:ListBox runat="server" ID="listBoxAllProducts" Width="400" Height="120" >
                                       </asp:ListBox>
                                   </td>
                               </tr>
                               <tr>
                                   <td align="left">
                                       <table>
                                           <tr>
                                               <td>
                                                   <asp:Label runat="server" Text="Your selected products to show"></asp:Label>
                                               </td>
                                               <td align="right" style="width: 31px;">
                                                   <asp:Button ID="btnAddProduct" runat="server" OnClick="btnAddProduct_Click" Text="+"
                                                       Width="26" />
                                               </td>
                                               <td align="left">
                                                   <asp:Button ID="btnRemoveProduct" runat="server" OnClick="btnRemoveProduct_Click"
                                                       Text="-" Width="26" />
                                               </td>
                                           </tr>
                                       </table>
                                   </td>
                               </tr>
                               <tr>
                                   <td>
                                       <asp:ListBox runat="server" ID="listBoxShownProducts" Width="400" Height="100"></asp:ListBox>
                                   </td>
                               </tr>
                               <tr>
                                   <td>
                                       <asp:Label runat="server" ForeColor="Red" ID="LblmaxProdInfo" Text="You can select only up to 5 products!"></asp:Label>
                                   </td>
                               </tr>
                           </table>
                       </div> 
                    </div>    
                </div>
            </div>
            </ContentTemplate>
        </asp:UpdatePanel>
        </asp:Panel>
        <asp:ModalPopupExtender ID="ModPopup" runat="server" BackgroundCssClass="modal-bg" 
        TargetControlID="btnSelectProducts" PopupControlID="pnlModal" CancelControlID="btnCancel"/>
    </div>
    <div style="display: none">
        <input runat="server" id="btnCancel" type="button" value="Cancel" />
     </div>
    <script type="text/javascript">
        var locked = 0;
        function relatedComponent(compId) {
            switch (compId) {
                case 1:
                    return document.getElementById('<%= status1.ClientID %>');
                    break;
                case 2:
                    return document.getElementById('<%= status2.ClientID %>');
                    break;
                case 3:
                    return document.getElementById('<%= status3.ClientID %>');
                    break;
                case 4:
                    return document.getElementById('<%= status4.ClientID %>');
                    break;
                case 5:
                    return document.getElementById('<%= status5.ClientID %>');
                    break;
                case 6:
                    return document.getElementById('<%= status6.ClientID %>');
                    break;
                case 7:
                    return document.getElementById('<%= status7.ClientID %>');
                    break;
                case 8:
                    return document.getElementById('<%= status8.ClientID %>');
                    break;
            }
        }
        function Hide(compId) {
            var elem = relatedComponent(compId);
            if (locked != compId)
                elem.style.display = "none";
        }
        function HideAndUnlock(compId) {
            var elem = relatedComponent(compId);
            elem.style.display = "none";
            locked = compId;
        }
        function Show(compId) {
            locked = 0;
            for (var i = 1; i < 9; i++) {
                Hide(i);
            }
            var elem = relatedComponent(compId);
            elem.style.display = "";
        }
        function ShowAndLock(compId) {
            locked = compId;
            for (var i = 1; i < 9; i++) {
                Hide(i);
            }
            var elem = relatedComponent(compId);
            elem.style.display = "";
        }

        function ShowPopUp() 
        {
            var elem = document.getElementById('<%= divPopUp.ClientID %>');
            elem.style.visibility = "visible";
        }
    </script>
</asp:Content>
